<template>
  <div class="payment-report">
    <!-- 搜索区域 -->
    <div class="search-container">
      <el-input
        placeholder="请输入单据编号"
        style="width: 180px; margin-right: 10px"
      />

      <el-date-picker 
        v-model="dateRange" 
        type="daterange" 
        range-separator="-" 
        start-placeholder="开始日期" 
        end-placeholder="结束日期" 
        style="width: 240px; margin-right: 10px"
        @change="handleDateChange"
      />

      <el-select placeholder="付款人" style="width: 120px; margin-right: 10px">
        <el-option label="(空)" value="" />
      </el-select>

      <el-select 
        v-model="searchParams.status"
        placeholder="审核状态" 
        style="width: 120px; margin-right: 10px"
        clearable
      >
        <el-option label="(空)" value="" />
        <el-option label="已保存" value="0" />
        <el-option label="已提交" value="1" />
        <el-option label="已审核" value="2" />
        <el-option label="已驳回" value="3" />
      </el-select>
      
      <el-button @click="handleReset">重置</el-button>
      <el-button type="primary" @click="handleSearch" style="margin-left: 5px">查询</el-button>
    </div>

    <!-- 操作按钮区域 -->
    <div class="action-buttons">
      <el-button type="primary" @click="toPaymentSlip()">新增</el-button>
      <el-button type="primary" @click="toputit()">提交</el-button>

      <el-dropdown @command="handleAuditCommand" placement="bottom-start">
        <el-button>审核 ▼</el-button>
        <template #dropdown>
          <el-dropdown-menu>
            <el-dropdown-item command="pass">通过</el-dropdown-item>
            <el-dropdown-item command="reject">驳回</el-dropdown-item>
          </el-dropdown-menu>
        </template>
      </el-dropdown>

      <el-dropdown>
        <el-button>导入 ▼</el-button>
        <template #dropdown>
          <el-dropdown-menu>
            <el-dropdown-item>导入Excel</el-dropdown-item>
            <el-dropdown-item>下载模板</el-dropdown-item>
          </el-dropdown-menu>
        </template>
      </el-dropdown>

      <el-button type="danger" @click="handleBatchDelete">删除</el-button>
    </div>

    <!-- 表格区域 -->
    <el-table
      :data="tableData"
      border
      stripe
      @selection-change="handleSelectionChange"
      :header-cell-style="{ backgroundColor: '#f5f7fa', fontWeight: 'normal' }"
      show-summary
      :summary-method="getSummaries"
    >
      <!-- 复选框列 -->
      <el-table-column type="selection" width="40" />

      <!-- 操作列 -->
      <el-table-column label="操作" width="100" align="center" fixed="left">
        <template #default="{ row }">
          <div class="table-actions">
            <el-button type="text" @click="handleEdit(row)" class="edit-btn">编辑</el-button>
            <el-button type="text" @click="handleDelete(row)" class="delete-btn">删除</el-button>
          </div>
        </template>
      </el-table-column>

      <!-- 单据日期 -->
      <el-table-column prop="docDate" label="单据日期" width="110" sortable>
        <template #default="{ row }">
          {{ formatDate(row.payment_date) }}
        </template>
      </el-table-column>

      <!-- 单据编号 -->
      <el-table-column prop="payment_code" label="单据编号" width="160" sortable></el-table-column>

      <!-- 源单编号 -->
      <el-table-column prop="sourceDocNos" label="源单编号" width="160">
        <template #default="{ row }">
          <div class="source-doc-nos">
            <div 
              v-for="(detail, index) in row.paymentDetails" 
              :key="index"
              class="source-doc-item"
              :title="detail.payable_code"
            >
              <a href="">{{ detail.payable_code }}</a>
            </div>
            <div v-if="!row.paymentDetails || row.paymentDetails.length === 0" class="no-data">
              -
            </div>
          </div>
        </template>
      </el-table-column>
      <!-- 供应商 -->
      <el-table-column prop="supplier" label="供应商" width="180">
        <template #default="{ row }">
          {{ getSupplierName(row) }}
        </template>
      </el-table-column>

      <!-- 供应商类别 -->
      <!-- <el-table-column prop="supplierCategory" label="供应商类别" width="100">
        <template #default="{ row }">
          <span v-if="!row.isPlaceholder">{{ row.supplierCategory }}</span>
        </template>
      </el-table-column> -->

      <!-- 结算账户 -->
      <el-table-column prop="settlementAccounts" label="结算账户" width="120">
        <template #default="{ row }">
          <div class="settlement-accounts">
            <div 
              v-for="(account, index) in row.paymentAccounts" 
              :key="index"
              class="account-item"
              :title="`${account.account_code} ${account.account_name}`"
            >
              {{ account.account_code }} {{ account.account_name }}
            </div>
            <div v-if="!row.paymentAccounts || row.paymentAccounts.length === 0" class="no-data">
              -
            </div>
          </div>
        </template>
      </el-table-column>

      <!-- 付款金额 -->
      <el-table-column prop="amounts" label="付款金额" width="150" align="right">
        <template #default="{ row }">
          <div class="amount-items">
            <div 
              v-for="(account, index) in row.paymentAccounts" 
              :key="index"
              class="amount-item"
            >
              {{ (account.amount || 0).toFixed(2) }}
            </div>
            <div v-if="!row.paymentAccounts || row.paymentAccounts.length === 0" class="no-data">
              {{ (row.amount || 0).toFixed(2) }}
            </div>
          </div>
        </template>
      </el-table-column>

      <el-table-column prop="current_written_off_all_amount" label="本次核销金额" width="130">
        <template #default="{ row }">
          {{ row.current_written_off_all_amount || '0.00' }}
          <!-- {{ row.type === 1 ? `-${row.current_written_off_all_amount}`: row.current_written_off_all_amount || '0.00' }} -->
        </template>
      </el-table-column>
      <el-table-column prop="order_discount" label="整单折扣" width="100">
        <template #default="{ row }">
          {{ row.order_discount || '0.00' }}
        </template>
      </el-table-column>
      <el-table-column prop="amount" label="收款合计" width="120"></el-table-column>
      <el-table-column label="本次预付款" width="100" align="right">
        <template #default="{ row }">
          {{ calculatePrePayment(row) }}
        </template>
      </el-table-column>
      <el-table-column label="本单已核销金额" width="130" align="right">
        <template #default="{ row }">
          <!-- {{ row.type === 1 ? `-${calculateWrittenOffAmount(row)}` : calculateWrittenOffAmount(row) }} -->
          {{ calculateWrittenOffAmount(row) }}
        </template>
      </el-table-column>
      
      <el-table-column label="本单未核销金额" width="130" align="right">
        <template #default="{ row }">
          {{ calculateUnwrittenOffAmount(row) }}
        </template>
      </el-table-column>
      <el-table-column label="核销状态" width="100">
        <template #default="{ row }">
          {{ getWriteOffStatus(row) }}
        </template>
      </el-table-column>

      <!-- 付款方式 -->
      <el-table-column prop="paymentMethod" label="付款方式" width="100">
        <template #default="{ row }">
          <span v-if="!row.isPlaceholder">{{ row.paymentMethod || "-" }}</span>
        </template>
      </el-table-column>

      <!-- 审核状态 -->
      <el-table-column prop="status" label="审核状态" width="100">
        <template #default="{ row }">
          <span class="status-tag">
            {{ getStatusText(row.status) }}
          </span>
        </template>
      </el-table-column>

      <!-- 结算号 -->
      <el-table-column prop="settlementNo" label="结算号" width="100">
        <template #default="{ row }">
          <span v-if="!row.isPlaceholder">{{ row.settlementNo || "-" }}</span>
        </template>
      </el-table-column>

      <!-- 分录备注 -->
      <el-table-column prop="memo" label="分录备注" min-width="120">
        <template #default="{ row }">
          <span v-if="!row.isPlaceholder">{{ row.memo || "-" }}</span>
        </template>
      </el-table-column>

      <el-table-column label="业务员"></el-table-column>
      <el-table-column label="制单人"></el-table-column>
      <el-table-column label="备注"></el-table-column>
      <el-table-column label="在线交易号" width="100"></el-table-column>
      
      <el-table-column label="打印次数" width="100"></el-table-column>
      <el-table-column label="单据来源" width="100"></el-table-column>
      <!-- <el-table-column label="供应商类别" width="100">
        <template #default="{ row }">
          {{ getCustomerTypeName(row.customer_id) }}
        </template>
      </el-table-column> -->

    </el-table>

    <!-- 分页组件 -->
    <div class="pagination-container">
      <el-pagination
        v-model:current-page="pagination.currentPage"
        v-model:page-size="pagination.pageSize"
        :total="pagination.total"
        :page-sizes="[10, 20, 50, 100]"
        layout="total, sizes, prev, pager, next, jumper"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
      />
    </div>
  </div>
</template>

<script setup>
import { ref, reactive, onMounted } from 'vue';
// import { Setting } from '@element-plus/icons-vue';
import { useRouter } from 'vue-router';
import { ElMessage, ElMessageBox } from 'element-plus';
import axios from 'axios';
import dayjs from 'dayjs';

const router = useRouter();
const loading = ref(false);
const multipleSelection = ref([]);

const dateRange = ref([]);

const route = useRouter();


// 示例数据
const tableData = ref([]);
const supplierList = ref([]);
// const supplierTypeList = ref([]);
// 搜索参数
const searchParams = reactive({
  receiptCode: '',
  customerId: '',
  status: '',
  startDate: '',
  endDate: ''
});
// 分页参数
const pagination = reactive({
  currentPage: 1,
  pageSize: 10,
  total: 0
});

// 初始化数据
onMounted(() => {
  loadTableData();
  getSupplierList();
  // getSupplierTypeList();
});
// 获取供应商列表
const getSupplierList = async () => {
  try {
    const response = await axios.get('/finance/getSupplierList',{params:{pageNum:1,pageSize:100}}); 
    if (response.data.code === 5200) {
      supplierList.value = response.data.supplierList.pageInfo.list || [];
    }
  } catch (error) {
    console.error('获取供应商列表失败:', error);
  }
};
console.log('供应商',supplierList)

// 根据供应商 ID 获取供应商名称
const getSupplierName = (row) => {
  if (row.supplier_id === null || row.supplier_id === undefined || row.supplier_id === '') {
    return '-';
  }
  const supplier = supplierList.value.find(item => 
    String(item.id) === String(row.supplier_id)
  );

  return supplier ? supplier.name : '-';
};
// 加载表格数据
const loadTableData = async () => {
  try {
    // 构建查询参数
    const params = {
      pageNum: pagination.currentPage,
      pageSize: pagination.pageSize,
      receiptCode: searchParams.receiptCode,
      customerId: searchParams.customerId,
      status: searchParams.status,
      startDate: searchParams.startDate,
      endDate: searchParams.endDate,
      companyCode: 'GS0001' 
    };
    
    // 移除空参数
    Object.keys(params).forEach(key => {
      if (params[key] === '' || params[key] === null || params[key] === undefined) {
        delete params[key];
      }
    });
    // 获取付款单列表
    const response = await axios.get('/finance/getPaymentList',{params});
    if (response.data.code === 5200) {
      const paymentList = response.data.paymentList.list || [];
      
      // 为每个付款单获取关联的账户和详情信息
      const enrichedReceipts = await Promise.all(
        paymentList.map(async (payment) => {
          try {
            // 获取付款单账户信息
            const accountResponse = await axios.get('/finance/getPaymentAccountList', {
              params: { payment_id: payment.payment_id }
            });
            // 获取付款单详情（源单编号）
            const detailsResponse = await axios.get('/finance/allPaymentDetails', {
              params: { payment_id: payment.payment_id }
            });
            const receiptDetails = detailsResponse.data.code === 5200 ? detailsResponse.data.allPaymentDetails : [];
            // 提取所有关联的 payable_code（去重避免重复请求）
            const payableCodes = [...new Set(
              receiptDetails
                .filter(detail => detail.payable_id) // 过滤空编码
                .map(detail => detail.payable_id)
            )];
            // 批量请求销售单数据（一个编码一个请求，并行执行）
            const procurmentPromises = payableCodes.map(id => 
              axios.get('/finance/getProcurmentById', { params: { procurement_id:id } })
            );
            const procurmentResponses = await Promise.all(procurmentPromises);

            // 合并所有请求结果，过滤失败响应
            const procurmentList = procurmentResponses
              .filter(res => res.data.code === 5200 && res.data.procurment)
              .flatMap(res => {
                const procurment = res.data.procurment;
                return Array.isArray(procurment) ? procurment : [procurment];
              });

            return {
              ...payment,
              paymentAccounts: accountResponse.data.code === 5200 ? accountResponse.data.paymentAccountList : [],
              paymentDetails: receiptDetails,
              procurmentList: procurmentList, // 合并后的所有关联源单数据
              
            };
          } catch (error) {

            console.error(`获取付款单 ${payment.payment_code} 的关联信息失败:`, error);
            return {
              ...payment,
              paymentAccounts: [],
              paymentDetails: [],
              procurmentList: [],
            };
          }
        })
      );
      console.log('最终表格数据:', enrichedReceipts);
      console.log('paymentAccounts 详细数据:', JSON.stringify(enrichedReceipts[0].paymentAccounts, null, 2));
      tableData.value = enrichedReceipts;
      pagination.total = tableData.value.length;
    } else {
      ElMessage.error(response.data.msg || '获取数据失败');
    }
  } catch (error) {
    ElMessage.error('网络错误，请重试');
    console.error('加载数据失败:', error);
  } finally {
    loading.value = false;
  }
};








// 选择变化
const handleSelectionChange = (selection) => {
  multipleSelection.value = selection;
};

// 编辑
const handleEdit = (row) => {
  if(row.status===1){
    ElMessage.error('该单据已提交，无法修改');
    return;
  }
  if(row.status===2){
    ElMessage.error('该单据已审核，无法修改');
    return;
  }
  router.push({
    path: '/finance/payment-slip',
    query: {
      code: row.payment_code,
      companyCode: 'GS0001'
    }
  });
}
//提交
const toputit = async () =>{
  if (multipleSelection.value.length === 0) {
    ElMessage.warning('请选择要提交的付款单');
    return;
  }
  
  // const alreadyAuditedReceipts = multipleSelection.value.filter(item => (item.status === 2 || item.status ===1));
  // if (alreadyAuditedReceipts.length > 0) {
  //   const receiptCodes = alreadyAuditedReceipts.map(item => item.receipt_code).join('、');
  //   ElMessage.warning(`以下单据已审核或已提交，无法提交：${receiptCodes}`);
  //   return;
  // }
  const forbiddenItems = multipleSelection.value.filter(item => 
    item.status === 1 || item.status === 2
  );

  // 不能提交的单据
  if (forbiddenItems.length > 0) {
    const forbiddenCodes = forbiddenItems.map(item => item.payment_code).join('、');
    const statusTextMap = { 1: '已提交', 2: '已审核' };
    const statusTexts = [...new Set(forbiddenItems.map(item => statusTextMap[item.status]))].join('、');
    ElMessage.error(`以下单据${statusTexts}，禁止提交：${forbiddenCodes}`);
    return;
  }
  console.log('选中的付款单数据:', JSON.parse(JSON.stringify(multipleSelection.value)));
  try {
     await ElMessageBox.confirm(`确定提交选中的记录吗？`, '提示', {
      type: 'warning'
    });
    const updatePromises = multipleSelection.value.map(item => {
      return axios.get('/finance/updatePaymentStatus', {
        params: {
          status: 1,
          payment_code: item.payment_code
        }
      });
    });
    
    const results = await Promise.all(updatePromises);
    const allSuccess = results.every(res => res.data.code === 5200);
    
    if (allSuccess) {
      ElMessage.success('提交通过成功');
      loadTableData();
    } else {
      ElMessage.error('部分收款单提交失败，请检查');
    }
  } catch (error) {
    console.error('提交通过操作失败:', error);
    ElMessage.error('提交操作失败，请重试');
  }
};
// 删除
const handleDelete = async (row) => {
  try {
    await ElMessageBox.confirm('确定删除该付款单吗？', '提示', {
      type: 'warning'
    });
    if(row.status===2){
      ElMessage.error('该订单已审核，无法删除')
      return;
    }
    if(row.status===1){
      ElMessage.error('该订单已提交，请驳回后再删除')
      return;
    }
    // 调用删除接口
    const response = await axios.get(`/finance/deletePaymentOrder?payment_id=${row.payment_id}`);
    if (response.data.code === 5200) {
      ElMessage.success('删除成功');
      loadTableData();
    } else {
      ElMessage.error(response.data.msg || '删除失败');
    }
  } catch (error) {
    if (error !== 'cancel') {
      ElMessage.error('删除失败');
    }
  }
};

// 批量删除
const handleBatchDelete = async () => {
  if (multipleSelection.value.length === 0) {
    ElMessage.warning('请选择要删除的付款单');
    return;
  }
  
  // 不允许删除的单据（1=已提交、2=已审核）
  const forbiddenItems = multipleSelection.value.filter(item => 
    item.status === 1 || item.status === 2
  );

  // 不允许删除的单据
  if (forbiddenItems.length > 0) {
    const forbiddenCodes = forbiddenItems.map(item => item.payment_code).join('、');
    const statusTextMap = { 1: '已提交', 2: '已审核' };
    const statusTexts = [...new Set(forbiddenItems.map(item => statusTextMap[item.status]))].join('、');
    ElMessage.error(`以下单据${statusTexts}，禁止删除：${forbiddenCodes}`);
    return;
  }

  try {
    await ElMessageBox.confirm(`确定删除选中的记录吗？`, '提示', {
      type: 'warning'
    });
    
    // 批量删除逻辑
    const deletePromises = multipleSelection.value.map(item => 
      axios.get(`/finance/deletePaymentOrder?payment_id=${item.payment_id}`)
    );
    
    await Promise.all(deletePromises);
    ElMessage.success('删除成功');
    loadTableData();
  } catch (error) {
    if (error !== 'cancel') {
      ElMessage.error('删除失败');
    }
  }
};

// 审核命令处理
const handleAuditCommand = async (command) => {
  if (multipleSelection.value.length === 0) {
    ElMessage.warning('请选择要审核的付款单');
    return;
  }
  
  // 审核通过的情况
  if (command === 'pass') {
    // 检查是否有已审核的单据
    const alreadyAuditedReceipts = multipleSelection.value.filter(item => item.status !==1 );
    if (alreadyAuditedReceipts.length > 0) {
      const paymentCodes = alreadyAuditedReceipts.map(item => item.payment_code).join('、');
      ElMessage.warning(`以下单据已审核或未提交，无法审核：${paymentCodes}`);
      return;
    }
    console.log('选中的付款单数据:', JSON.parse(JSON.stringify(multipleSelection.value)));
    try {
      const updatePromises = multipleSelection.value.map(item => {
        return axios.get('/finance/updatePaymentStatus', {
          params: {
            status: 2,
            payment_code: item.payment_code
          }
        });
      });
      
      const results = await Promise.all(updatePromises);
      const allSuccess = results.every(res => res.data.code === 5200);
      
      if (allSuccess) {
        ElMessage.success('审核通过成功');
        loadTableData();
      } else {
        ElMessage.error('部分付款单审核失败，请检查');
      }
    } catch (error) {
      console.error('审核通过操作失败:', error);
      ElMessage.error('审核操作失败，请重试');
    }
  } 
  // 审核不通过的情况
  else if (command === 'reject') {
    const notSubmittedReceipts = multipleSelection.value.filter(item => item.status !== 1);
    if (notSubmittedReceipts.length > 0) {
      const paymenttCodes = notSubmittedReceipts.map(item => item.payment_code).join('、');
      ElMessage.warning(`以下单据未提交或已审核，无法驳回：${paymenttCodes}`);
      return;
    }

    try {
      const updatePromises = multipleSelection.value.map(item =>
        axios.get('/finance/updatePaymentStatus', {
          params: { 
            status: 3, 
            payment_code: item.payment_code 
          }
        })
      );
      
      await Promise.all(updatePromises);
      ElMessage.success('审核驳回成功');
      loadTableData();
    } catch (error) {
      ElMessage.error('审核驳回操作失败');
    }
  }
};

const calculateWrittenOffAmount = (row) => {
  // 方法1：从付款单详情中汇总核销金额
  let totalFromDetails = row.paymentDetails?.reduce((sum, detail) => 
    sum + (Number(detail.current_written_off_amount) || 0), 0) || 0;
    // detail.type==="1"?-(sum + (Number(detail.current_written_off_amount))):sum + (Number(detail.current_written_off_amount) || 0), 0) || 0;
  // if (row.type === 1) {
  //   totalFromDetails = -totalFromDetails;
  // }
  // 方法2：如果方法1为0，尝试从关联的销售单中获取
  // if (totalFromDetails === 0 && row.paymentList && row.paymentList.length > 0) {
  //   const totalFromSaleSlips = row.paymentList.reduce((sum, payment) => 
  //     sum + (Number(payment.current_written_off_amount) || 0), 0);
  //   return totalFromSaleSlips.toFixed(2);
  // }
  return totalFromDetails.toFixed(2);
};

// 未核销金额：付款合计 - 本单已核销金额
const calculateUnwrittenOffAmount = (row) => {
  const totalReceipt = Number(row.amount) || 0;
  
  // 使用与"本单已核销金额"相同的数据源
  const writtenOff = calculateWrittenOffAmount(row); // 复用已核销金额的计算
  
  const unwrittenOff = totalReceipt - parseFloat(writtenOff);
  return unwrittenOff >= 0 ? unwrittenOff.toFixed(2) : '0.00';
};

// 计算本次预付款（付款合计 - 本次核销金额 + 整单折扣）
const calculatePrePayment = (row) => {
  // 付款合计
  const totalPayment = Number(row.amount) || 0;
  // 本次核销金额
  const totalWriteOff = row.paymentDetails?.reduce((sum, item) => sum + (Number(item.current_written_off_amount) || 0), 0) || 0;
  // 整单折扣
  const orderDiscount = Number(row.order_discount) || 0;
  const prePayment = totalPayment - totalWriteOff + orderDiscount;
  return prePayment >= 0 ? prePayment.toFixed(2) : '0.00';
};

// 打印命令处理
// const handlePrintCommand = (command) => {
//   if (command === 'current') {
//     ElMessage.info('打印当前页');
//   } else {
//     ElMessage.info('打印全部');
//   }
// };

// 状态文本映射
const getStatusText = (status) => {
  const statusMap = {
    0: '未审核',
    1: '已提交', 
    2: '已审核',
    3: '已驳回'
  };
  return statusMap[status] || '未知';
};
// 日期格式化
const formatDate = (dateString) => {
  if (!dateString) return '';
  if (typeof dateString === 'string') {
    return dateString.split(' ')[0]; // 只取日期部分
  }
  return dayjs(dateString).format('YYYY-MM-DD');
};

const formatDateToServer = (date) => {
  return dayjs(date).format('YYYY-MM-DD');
};

// 合计计算方法
const getSummaries = ({ columns, data }) => {
  const sums = [];
  columns.forEach((column, index) => {
    if (index === 6) {
      sums[index] = "合计:";
      return;
    }

    // 根据列的prop属性计算不同列的合计
    const field = column.property;
    if (
      [
       "amount"
      ].includes(field)
    ) {
      const values = data.map((item) => Number(item[field]) || 0);
      sums[index] = values.reduce((prev, curr) => prev + curr, 0).toFixed(2);
    } else {
      sums[index] = ""; // 非金额列不显示合计
    }
  });

  return sums;
};

// 日期变化处理
const handleDateChange = (dates) => {
  if (dates && dates.length === 2) {
    searchParams.startDate = formatDateToServer(dates[0]);
    searchParams.endDate = formatDateToServer(dates[1]);
  } else {
    searchParams.startDate = '';
    searchParams.endDate = '';
  }
};

// 获取核销状态
const getWriteOffStatus = (row) => {
  const totalReceipt = Number(row.amount) || 0;
  const unwrittenOff = parseFloat(calculateUnwrittenOffAmount(row));
  if (unwrittenOff === totalReceipt) {
    return '未核销';
  } else if (unwrittenOff > 0) {
    return '部分核销';
  } else {
    return '全部核销';
  }
};
//路由跳转
const toPaymentSlip = () => {
  route.push("/finance/payment-slip");
};
</script>

<style scoped>
.payment-report {
  padding: 15px;
  background-color: #fff;
  min-height: 500px;
}
.source-doc-item a {
  color: blue;
  text-decoration: none; 
}
/* 搜索区域样式 */
.search-container {
  display: flex;
  align-items: center;
  margin-bottom: 15px;
  flex-wrap: wrap;
  gap: 10px;
}

/* 操作按钮区域 */
.action-buttons {
  display: flex;
  align-items: center;
  margin-bottom: 15px;
  gap: 8px;
}

.column-setting {
  margin-left: auto;
  color: #606266;
}

/* 表格样式 */
::v-deep .el-table {
  border: 1px solid #e4e7ed;
}

/* 占位行样式 */
::v-deep .placeholder-row {
  height: 48px; /* 固定行高 */
  opacity: 0.3;
}

/* 操作按钮样式 */
.table-actions {
  display: flex;
  justify-content: center;
  gap: 5px;
}

.edit-btn {
  color: #409eff;
  padding: 0;
}

.delete-btn {
  color: #f56c6c;
  padding: 0;
}

/* 表头样式优化 */
::v-deep .el-table__header th {
  background-color: #f5f7fa !important;
}
/* 源单编号标签样式 */
.source-doc-nos {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.source-doc-tag {
  color: #1989fa;
  font-size: 12px;
  padding: 0 2px;
  text-decoration: underline;
  cursor: pointer;
}

/* 状态标签样式 */
.status-tag {
  padding: 2px 8px;
  border-radius: 12px;
  font-size: 12px;
}

.status-unpass {
  background-color: #fef0f0;
  color: #f56c6c;
}

.status-pass {
  background-color: #f0f9eb;
  color: #67c23a;
}


:deep(.el-table) .el-table__footer .el-table__cell {
  background-color: #fff3cd !important;
  font-weight: bold !important;
}

:deep(.el-table .el-table__row.summary-row) {
  background-color: #f8f8f8 !important;
  font-weight: bold;
}

:deep(.el-table .el-table__row.summary-row:hover > td) {
  background-color: #fff4bf !important;
}

:deep(.el-table .el-table__row:hover > td) {
  background-color: #fff4bf !important;
}
</style>